import fragment from '../../examples/files/patterns/fragment.tsx'
import fragmentShorthand from '../../examples/files/patterns/fragmentShorthand.tsx'

## Fragments

When we want to return multiple top-level elements from a component, we can return a `React.Fragment`. Fragments don't insert any additional markup in the DOM (i.e. we don't want to use a `div`, since we don't need an extra DOM element).

<Example code={fragment} />

## Shorthand syntax

There's a shorthand syntax for this: we can omit the name of the element entirely.

<Example code={fragmentShorthand} />
